<template>
  <div class="list-container">
    <el-form class="search-panel" v-model="formData" :inline="true">
      <el-form-item label-width="120px" label="输入搜索：">
        <el-input v-model="searchForm.name"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">查询</el-button>
      </el-form-item>
    </el-form>
    <div class="table-panel">
      <el-row class="table-operate">
        <el-button type="primary" @click="onSubmit">新增月工资</el-button>
      </el-row>
      <el-row>
        <el-col :span="5" style="border-right: 1px solid #e8e8e8">
          <el-tree
            :data="treeData"
            :props="defaultProps"
            @node-click="handleNodeClick"
          ></el-tree>
        </el-col>
        <el-col :span="19">
          <el-table
            :data="tableData"
            style="width: 100%"
            @selection-change="handleSelectionChange"
          >
            <el-table-column
              type="selection"
              align="center"
              :selectable="selectEnable"
            />
            <el-table-column align="center" type="index" width="55" label="序号">
            </el-table-column>
            <el-table-column align="center" prop="personName" label="姓名">
            </el-table-column>
            <el-table-column align="center" prop="attendanceDays" label="开卡银行">
            </el-table-column>
            <el-table-column align="center" prop="referenceMonthlyWage" label="开卡时间">
            </el-table-column>
            <el-table-column prop="status" label="开卡状态" align="center"
            ></el-table-column>
            
            <el-table-column
              label="操作"
              align="center"
              min-width="150"
              fixed="right"
            >
              <template slot-scope="scope">
                <el-button
                  @click.native.prevent="checkRow(scope.row, scope.$index)"
                  type="text"
                  icon="el-icon-edit"
                  >查看</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <el-row class="page">
        <div class="page-tag">
          共{{ Math.ceil(totalData / searchForm.pageSize) }}页/{{
            totalData
          }}条数据
        </div>
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="searchForm.currentPage"
          :page-sizes="[10, 20, 50]"
          :page-size="searchForm.pageSize"
          layout="sizes, prev, pager, next, jumper"
          :total="totalData"
        >
        </el-pagination>
      </el-row>
    </div>
  </div>
</template>

<script>
import { getTree, getPersonByTeamId } from "@/api/worker";
import corp from "@/api/corp";
import { laborDistList, fineAndBonus, insertMonthlyWage } from "@/api/wage";
import workflowApi from "@/api/workflow/workFlow";
import team from "@/api/team";
export default {
  data() {
    return {
      //页面
      companyId: localStorage.getItem("companyId"),
      totalData: 0,
      //tree
      flag: 1, //1--一级劳务公司，0--二级班组
      treeData: [],
      defaultProps: {
        children: "children",
        label: "name",
      },
      //table
      searchForm: {
        currentPage: 1,
        date: this.$route.query.date,
        endDate: null,
        pageSize: 10,
        serviceCorporationId: null,
        startDate: null,
        teamId: null,
      },
      
    };
  },
  async created() {
    this.getTreeData();
  },
  methods:{
    // 获取劳务公司、班组树形数据
    getTreeData() {
      console.log("getTreeData");
      var id = this.companyId;
      if (this.companyId == 0) id = null;
      getTree(id).then((res) => {
        this.treeData = res.data.data;
      });
    },
    // 树状图
    async handleNodeClick(res) {
      if (res.children == null) {
        this.flag = 0;
        this.searchForm.teamId = res.id;
        //this.searchForm.serviceCorporationId = null;
        this.getTableData();
      } else {
        this.flag = 1;
        this.searchForm.serviceCorporationId = res.id;
        this.searchForm.teamId = null;
        console.log("劳务公司");
        this.getTableData();
      }
    },
    onSubmit(){
      console.log("onSubmit");
    },
    getTableData(){
      
    },
    handleSizeChange(val) {
      this.searchForm.pageSize = val;
      this.getTableData();
    },
    //更改当前页
    handleCurrentChange(val) {
      this.searchForm.currentPage = val;
      this.getTableData();
    },
  }
};
</script>
